<template>
  <view class="kuafu-apartment-page">
    <up-icon
      class="back-icon"
      name="arrow-left"
      size="30rpx"
      @tap="handleBackIconClick"
    />
    <view class="page-bg" />

    <view class="page-main">
      <view class="menu-box">
        <icon-menu-item
          v-for="(item, index) in menuList"
          :key="index"
          :menu-name="item.name"
          :icon-url="item.iconUrl"
          @handle-menu-click-emit="handleMenuClick"
        />
      </view>
      <view class="swiper">
        <up-swiper
          v-if="swiperImgList.length > 0"
          :list="swiperImgList"
          :display-multiple-items="1"
          indicator
          indicatorMode="line"
          circular
          radius="33rpx"
          key-name="imgUrl"
        />
      </view>
      <view class="apartment">
        <h4 class="title">公寓分类</h4>
        <view class="card">
          <apartment-card
            v-for="apartment in apartmentTypeList"
            :key="apartment.id"
            :id="`apartment-${apartment.id}`"
            :apartment-data="apartment"
            @tap="onHouseTap(apartment.houseTypeBigId)"
          />
        </view>
      </view>
    </view>
    <custom-bottom-bar :cur-tab-value="0" />
  </view>
</template>
<script setup>
import { ref, inject } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import customBottomBar from "@/package_kuafu_apartment/pages/components/custom-bottom-bar/index.vue";
import iconMenuItem from "@/package_kuafu_apartment/pages/home/components/icon-menu-item/icon-menu-item.vue";
import apartmentCard from "@/package_kuafu_apartment/pages/home/components/apartment-card/apartment-card.vue";
import {
  getApartmentTypeListApi,
  getSwiperPicDataListApi,
  getAccessToken,
} from "@/package_kuafu_apartment/pages/api/home";
import { get1688NavParamsApi } from "../../../api/shopping";
import { getCurrentPagesTotal } from "@/utils/utils";
import { customNav } from "@/utils/customNav";

// 背景图片地址
const baseImgUrl = inject("baseImgUrl");
// 菜单列表
const menuList = ref([
  {
    name: "入住指南",
    iconUrl: `${baseImgUrl}2024-04-18/1713429748971入住指南icon@2x.png`,
  },
  {
    name: "商超服务",
    iconUrl: `${baseImgUrl}2024-04-18/1713430173707商超服务icon@2x.png`,
  },
  {
    name: "生活服务",
    iconUrl: `${baseImgUrl}2024-04-18/1713430220691生活服务icon@2x.png`,
  },
  {
    name: "物业服务",
    iconUrl: `${baseImgUrl}2024-04-18/1713430271747物业服务icon@2x.png`,
  },
]);
// 轮播图列表
const swiperImgList = ref([]);

const handleBackIconClick = () => {
  uni.switchTab({
    url: "/pages/index/index",
  });
};

/**
 * 监听按菜单按钮点击事件
 * @param menuName
 */
const handleMenuClick = (menuName) => {
  console.log(menuName);
  switch (menuName) {
    case "入住指南":
      customNav("pages/check-in-guide/check-in-guide");
      break;
    case "商超服务":
      get1688NavParams();
      break;
    case "生活服务":
      customNav("/package_property/pages/life-services/index");
      break;
    default:
      uni.showToast({
        title: "待开发",
        icon: "error",
      });
      break;
  }
};

const get1688NavParams = async () => {
  const res = await get1688NavParamsApi();
  const { code, data } = res;
  if (code === 200) {
    console.log("测试半瓶跳转参数code", data.code);
    // uni.openEmbeddedMiniProgram({
    uni.navigateToMiniProgram({
      appId: "wx90337e70657a6d17",
      path: "pages/index/index",
      // envVersion: "release",
      extraData: {
        authCode: data.code,
        mobile: data.phone,
      },
    });
  }
};
const onHouseTap = (houseId) => {
  customNav(`pages/house-details/index?houseTypeBigId=${houseId}`);
};
/**
 * 获取轮播图数据
 * @returns {Promise<void>}
 */
const getSwiperDataList = async () => {
  const res = await getSwiperPicDataListApi();
  const { code, data } = res;
  if (code === 200) {
    swiperImgList.value = data.map((item) => {
      return {
        imgUrl: item.prototypeRoomUrlList[0],
      };
    });
  }
};

/**
 * 获取公寓分类列表数据
 * @type {Ref<UnwrapRef<*[]>>}
 */
const apartmentTypeList = ref([]);
const getApartmentTypeList = async () => {
  const res = await getApartmentTypeListApi();
  const { code, data } = res;
  if (code === 200) {
    apartmentTypeList.value = data;
  }
};

// 绑定openid
const getWxLogin = () => {
  uni.login({
    provider: "weixin",
    success: function (loginRes) {
      console.log(loginRes);
      // getAccessToken({ code: loginRes.code }).then((res) => {});
    },
  });
};

onLoad(() => {
  getApartmentTypeList();
  getSwiperDataList();

  // #ifdef MP-WEIXIN
  // getWxLogin();
  // #endif
});
</script>
<style lang="less" scoped>
@import "./style/index.less";
</style>
